import Vue from 'vue'
import App from './App.vue'
import router from './router'
import store from './store'
import OrgTree from 'v-org-tree'
import 'v-org-tree/dist/v-org-tree.css'
Vue.use(OrgTree)
import { Button,Uploader,Popup,Col,Row,Icon,Toast } from 'vant';
Vue.use(Button).use(Uploader).use(Popup).use(Col).use(Row).use(Icon).use(Toast )
Vue.prototype.$toast=Toast
import ViewUI from 'view-design';
import 'view-design/dist/styles/iview.css';
import { directive as clickOutside } from 'v-click-outside-x'
Vue.directive('clickOutside', clickOutside)
Vue.config.productionTip = false
Vue.use(ViewUI);
Vue.directive('drag',el=>{
  let l=0;
  let t=0;
  el.onmousedown=function(e){
      console.log(e);
      //计算出元素距离上边和左边的距离（鼠标点击的位置-元素的位置）
      //这个应该能理解吧
      var disX=e.clientX-el.offsetLeft;
      var disY=e.clientY-el.offsetTop;
      document.onmousemove = function(e){
          //鼠标要按住不松开移动才行，松开就会触发onmouseup的事件
          //计算出元素移动后的位置（鼠标位置-元素初始的disX/disY）
           l=e.clientX-disX;
           t=e.clientY-disY;
          el.style.left=l+'px';
          el.style.top=t+'px';
      }
      document.onmouseup=function(e){
          document.onmousemove=null;
          document.onmouseup=null;
          el.style.left=l+'px';
          el.style.top=t+'px';
      }
  }
})
new Vue({
  router,
  store,
  render: h => h(App)
}).$mount('#app')
